<template>
	<view class="flex align-center search">
		<view class="margin-right-sm">
			<slot>
				<text :class="[icon?icon:'cuIcon-search']"></text>
			</slot>
		</view>
		<input 
		  :type="type"
		  v-model="searchText"
		  :placeholder="holder?holder:'请输入岗位名称进行搜索'"
		  @confirm="handleEmit"
		  @blur="handleEmit"
		/>
	</view>
</template>

<script lang="ts" setup>
import {type Ref, ref} from 'vue'
withDefaults(
  defineProps<{
    icon?:string,
	holder?:string,
	type?:string
	modelValue?: string
  }>(),
  {
	  type:'text'
  }
)
const modle =defineModel<string>()//获取组件的v-model数据
const searchText:Ref<string>=ref(modle.value?modle.value:'')
const handleEmit=()=>{
	modle.value=searchText.value
}

</script>

<style>
.search{
	padding: 30upx;
	border: 1upx solid #eee;
	border-radius: 6upx;
}
</style>